<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="jquery-1.11.3.min.js"></script>
</head>

<body>
    <input type="text" class="input" id="studentInput" charLength='10'>
    <span class="error-info"></span>
    <input type="text" class="input" id="fRemark" placeholder="2">
</body>
<script>

// 01可行  开始
// 计算出中文和英文的总长度
String.prototype.gblen = function() {
    var len = 0;
    for (var i = 0; i < this.length; i++) {
        if (this.charCodeAt(i) == 10) {//判断回车符
            continue;
        }
        if (this.charCodeAt(i) > 127 || this.charCodeAt(i) == 94) {
            len += 2;
        } else {
            len++;
        }
    }
    return len;
}
//截取字符长度,从index开始，截取的字符长度       中文算两个
function subgblen(str,start,length){
    str = str.substr(start,length);
    if(str.gblen() > length){
        str = str.substr(0,str.length - 1);
        return subgblen(str,0,length)
    }else{
        return str;
    }
}
$("#fRemark").on("keyup",function () {
    var memoVal = $("#fRemark").val().gblen();
    var Anum = memoVal > 10 ? 0 : 10-memoVal;
    if(memoVal > 10){
        $(this).val(subgblen($("#fRemark").val(),0,10));
    }
    
    $(".error-info").text("还可以输入"+Anum+"字符");
})
//   01 结束
//  $(function(){

    //      $('.input').keyup(function(){
    //         var inputVal = $('.input')
    //         filterKeyup(inputVal,10)
    //      })
    //  })
    // 02可行 开始
    $(document).ready(function () {
        $("#studentInput").on("input", function () {
            console.log(String.fromCharCode(94, 255, 0, 266, 1000, 10), '编码who')

            //charAt(1)返回指定位置的字符
            //charCodeAt(1)返回charAt(1)所代表字符的字符编码
            //fromCharCode 返回指定字符编码代表的字符
            var limit = $(this).attr("charLength");
            if (limit == "" || limit == null) {
                return;
            }
            var length = fucCheckLength($(this).val());
            if (length > limit) {
                $(this).val(subCharStr($(this).val(), limit));
            }
        });
    });

    function fucCheckLength(strTemp) {
        var i, sum;
        sum = 0;
        for (i = 0; i < strTemp.length; i++) {
            if ((strTemp.charCodeAt(i) >= 0) && (strTemp.charCodeAt(i) <= 255)) {
                sum = sum + 1;
            } else {
                sum = sum + 2;
            }
        }
        return sum;
    }

    function subCharStr(str, n) {
        var _len = fucCheckLength(str, n);
        if (_len > n) {
            var _newLen = Math.floor(n / 2);
            var _strLen = str.length;
            var _newStr = "";
            for (var i = _newLen; i <= _strLen; i++) {
                var tmpStr = str.substr(0, i);
                if (fucCheckLength(tmpStr) > n) {
                    return _newStr;
                    break;
                } else {
                    _newStr = tmpStr;
                }
            }
        } else {
            return str;
        }
    }
    // 02结束
    // 03不可行 待测试
    $('#studentInput2').on('input', function (e) {
        var $that = $(this),
            limit = 10;                            //定义所需字节数
        $that.attr('maxlength', limit);
        setTimeout(function () {
            var value = $that.val(),
                reg = /[\u4e00-\u9fa5]{1}/g,
                notReg = /\w{1}/g;
            var Cn = value.match(reg);
            var En = value.match(notReg);
            if (Cn) {
                limit = limit - (Cn.length * 2);
            }
            if (En) {

                limit = limit - En.length;
            }
            if (limit <= 0) {
                var finalLen = value.length + limit;
                value = value.substring(0, finalLen);
                $that.attr('maxlength', limit);
                $that[0].value = value;
            }
        }, 0);
    });

    //计算输入的字符或者汉字长度
    function getByteLen(val, n) {//计算字符长度(中文算2个字符，英文算1个字符）
        var len = 0;
        let limit = n
        for (var i = 0; i < val.length; i++) {
            var a = val.charAt(i);
            if (a.match(/[^\x00-\xff]/ig) != null) {
                len += 2;
            }
            else {
                len += 1;
            }
        }

        return limit - len;
    }

    function filterKeyup(obj, n) {
        console.log(getByteLen(obj.val(), n), '长度')
        if (getByteLen(obj.val(), n) < 0) {
            alert('false')
            let val = $(obj).val().substr(0, n)
            $(obj).val(val);
        }
        // if(getByteLen($.trim($(obj).val())) > n){

        // 	// obj.addClass("error-show");
        //     // var val = $(obj).val().substring(0,n);
        //     // $(obj).val(val);
        //     $(".error-info").text("不可以输入超过   " +  n  + '   个字符！   ' );
        //     return false;
        // }
        // // obj.removeClass("error-show");
        // $(".error-info").text("");
    }
</script>

</html>